<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>资料搜索</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="/mobile/css/mui.css">
    <link rel="stylesheet" href="/mobile/css/main.css"/>
    <style>
        .mui-search {
            width: 79%;
            display: inline-block;
            margin-left: 4%;
            margin-bottom: 0;
        }
    </style>

</head>

<body>
<div class="mui-content">
    <input type="hidden" id="netAppUrl" th:value="${netAppUrl}">
    <div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper d_main">
        <div class="mui-scroll d_list">
            <ul>
            </ul>
            <div class="d_kong" style="padding:0.5rem 0; text-align:center; display:none;"><img style="width:60%;"
                                                                                                src="/mobile/images/kong.png"/>
                <span style="display:block; text-align:center; padding-top:0.5rem; font-size:0.4rem; font-weight:bold; color:#555555;">暂无数据</span>
            </div>
        </div>

    </div>
</div>


<script src="/mobile/js/mui.js"></script>
<script type="text/javascript" src="/mobile/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/mobile/js/Foundation.js"></script>
<script src="/mobile/js/common.js"></script>
<script>
    var url = $('#netAppUrl').val();
    var keyword = common.getURLParam('keyword');
    var ids = common.getURLParam('ids');
    //二次
    var limit = 10;
    var noResultFlag = false;
    page = 0;

    mui.init({
        swipeBack: false,
        pullRefresh: {
            container: '#offCanvasContentScroll',
            down: {
                style: 'circle',
                callback: pulldownRefresh
            },
            up: {
                auto: true,
                contentrefresh: '正在加载...',
                callback: pullupRefresh
            }
        }
    });

    /**
     * 上拉加载
     */
    function pullupRefresh() {
        setTimeout(function () {
            mui('#offCanvasContentScroll').pullRefresh().endPullupToRefresh(noResultFlag); //参数为true代表没有更多数据了。
            //数据加载方法,页面刷新就会加载一次数据
            page = page + 1;
            loadData();
        }, 1000);
    }

    /**
     * 下拉刷新
     */
    function pulldownRefresh() {
        setTimeout(function () {
            location.reload();
        }, 500);
    }

    //搜索数据
    function loadData() {
        $('.d_kong').hide();
        if (limit == '' || typeof(limit) == "undefined") {
            limit = 10;
        }
        if (page == '' || typeof(page) == "undefined") {
            page = 1;
        }
        $.ajax({
            url: url + "/search",
            type: "POST",
            data: {
                keyword: keyword,
                ids: ids,
                page: page,
                limit: limit
            },
            traditional: true,
            success: function (res) {
                if (res.code == 0) {
                    if (res.data != null && res.data.length != 0) {
                        noResultFlag = false;
                        var ht = "";
                        var len = res.data.length;
                        for (var i = 0; i < len; i++) {
                            if (res.data[i].url != null) {
                                ht += '<li class="mui-table-view-cell mui-media" downloadHref="' + res.data[i].url + '"><div class="mui-media-body"><h2 class="mui-ellipsis">' + res.data[i].dataName + '</h2><p class="mui-ellipsis">' + res.data[i].university + '</p><p class="mui-ellipsis">' + res.data[i].professional + '  <span>提取码:' + res.data[i].code + '</span></p><p class="mui-ellipsis"></p></div></li>';
                            } else {
                                ht += '<li class="mui-table-view-cell mui-media" downloadHref="error"><div class="mui-media-body"><h2 class="mui-ellipsis">' + res.data[i].dataName + '</h2><p class="mui-ellipsis">' + res.data[i].university + '</p><p class="mui-ellipsis">' + res.data[i].professional + '  <span>提取码:资料缺失</span></p><p class="mui-ellipsis"></p></div></li>';
                            }
                        }
                        $('.d_list ul').append(ht);
                    } else {
                        noResultFlag = true;
                    }
                    if ($('.d_list ul li').length > 0) {
                        $('.d_kong').hide();
                    } else {
                        $('.d_kong').show();
                        $('.d_record span').text('0');
                    }
                }
            },
            error: function (res) {
                mui.toast('很抱歉，资料遗失到远古时代了，请稍候再试！');
            }
        });
    }

    /* 点击跳转到百度云 */
    mui('.d_list').on('tap', '.mui-media', download);

    function download() {
        var downloadHref = $(this).attr("downloadHref");
        if (downloadHref != "error") {
            window.location.href = downloadHref;
        } else {
            mui.toast('很抱歉，资料遗失到远古时代了，正在找回！');
        }
    }


</script>
</body>

</html>